<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>块元素</title>
	</head>
	<style>
		div {
			width: 200px;
			height: 200px;
			background-color: beige;
		}
		span {
			font: 18px;
			color: red;
		}
	</style>
	<body>
		<!-- 作用: 网页的标签非常多, 在不同的地方会用到不同类型的标签, 了解他们的特点可以更好的布局我们的网页 -->
		<!-- 元素显示模式就是元素(标签)以什么方式进行显示, 比如div标签独占一行, 一行可以有多个span标签 -->
		<!-- HTML元素分为块元素和行内元素 -->
		<!-- 常见的块元素有: 
		h1-h6, p, div(典型的块元素), ul, ol, li等, 
		特点:
			1.独占一行
			2.高度, 宽度, 外边距以及内边距都可以控制
			3.宽度默认是容器(父宽度)100%
			4.是一个容器及盒子, 可以放行内或块元素
		 -->
		 <div>
			 独占一行标签, 街霸
			 <span>你好!</span>
		 </div>
		 <!-- 注意: -->
			<!-- 文字类的元素内不能使用块元素 -->
			<!-- p标签主要用于存放文字, 因此p里面不能放块级元素, 特别不能放div -->
			<!-- 同理, h1-h6等都是文字类块级标签, 里面也不能放其他的块级元素 -->
			
	</body>
</html>
